<style>
	.imgcss{
		cursor:pointer;
	}
</style>
<div>
	<div class="col-xs-12" style="margin-top:200px">
		<div class="col-xs-4" style="text-align:center">
			<img src="@{'/public/images/create_court.png'}" id="create_court" class="imgcss" onmouseover="changeImg(1,'over')" onmouseout="changeImg(1,'move')" onclick="openCreateCourt()">
		</div>
		<div class="col-xs-4" style="text-align:center">
			<img src="@{'/public/images/court_live.png'}" id="court_live" class="imgcss" onmouseover="changeImg(2,'over')" onmouseout="changeImg(2,'move')" onclick="openCourtLive()">
		</div>
		<div class="col-xs-4" style="text-align:center">
			<img src="@{'/public/images/play_back.png'}" id="play_back" class="imgcss" onmouseover="changeImg(3,'over')" onmouseout="changeImg(3,'move')" onclick="openPlayBack()">
		</div>
	</div>


</div>
<script type="text/javascript">
	function changeImg(k,status){
		if(status=='over'){
			if(k==1){
				$("#create_court").attr("src","@{'/public/images/create_court_over.png'}");
			}else if(k==2){
				$("#court_live").attr("src","@{'/public/images/court_live_over.png'}");
			}else{
				$("#play_back").attr("src","@{'/public/images/play_back_over.png'}");
			}
		}
		else{
			if(k==1){
				$("#create_court").attr("src","@{'/public/images/create_court.png'}");
			}else if(k==2){
				$("#court_live").attr("src","@{'/public/images/court_live.png'}");
			}else{
				$("#play_back").attr("src","@{'/public/images/play_back.png'}");
			}
		}
		
	}
	
	function openCreateCourt(){
		opentab("02001","开庭","/admin/live_config","");
	}
	function openCourtLive(){
		opentab("02003","开庭中","/admin/liveCourt","");
	}
	function openPlayBack(){
		opentab("02004","已闭庭","/admin/stopCourt","");
	}
</script>